<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>add new note</title>
</head>
<link rel="stylesheet" href="../bootstrap/css/bootstrap.css" />
<link rel="stylesheet"
	href="../bootstrap-markdown/css/bootstrap-markdown.min.css" />

<script type="text/javascript" src="../common/js/jQuery-2.2.0.min.js"></script>
<script type="text/javascript" src="../bootstrap/js/bootstrap.js"></script>
<script
	src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script src="//cdn.bootcss.com/markdown.js/0.5.0/markdown.min.js"></script>
<script type="text/javascript"
	src="../bootstrap-markdown/js/bootstrap-markdown.js"></script>
<body>
	<div>
		<textarea id="markdown-textarea" data-provide="markdown"
			data-height="500" data-width="500" data-savable="true">
	
	</textarea>
	</div>

	<div id="markdown-div" data-provide="markdown-editable"></div>

</body>
<script>
	$(function() {
		$('#markdown-textarea').markdown({
			autofocus : false,
			savable : true,
			onShow : function(e) {
				alert(e.getContent());
			},
			onPreview : function(e) {
				alert(e.getContent());
			},
			onSave : function(e) {
				alert("Saving '" + e.getContent() + "'...")
			},
			onChange : function(e) {
				console.log("Changed!")
			},
			onFocus : function(e) {
				alert("Focus triggered!")
			},
			onBlur : function(e) {
				alert("Blur triggered!")
			}
		})
	})
</script>
</html>